<template>
  <section>
   <!--  <el-col :xs="6" :sm="6" :md="6" :lg="6" style="height:670px;width:25%;overflow-y :auto;overflow-x :auto">
      <div style="position:relative;font-size:18px;font-weight:bold;align:center;color:#48576a;box-sizing:border-box;">机构管理
     
        <el-tree highlight-current :data="data" :props="defaultProps" @node-click="handleNodeClick" :default-expand-all="true" :expand-on-click-node="false" show-overflow-tooltip>
      
        </el-tree>
      </div>
    </el-col> -->
  <div style="display:flex;justify-content:space-between;width:100%;height:100%">
    <div style="width:20%;position:relative;">
      <div style="position:absolute;height:100%;width:100%;overflow-y:auto;overflow-x:auto">
         <el-col  style="overflow:hidden;width:auto" >
        <!-- -->
        <el-tree  highlight-current :data="data" :props="defaultProps" @node-click="handleNodeClick" :default-expand-all="true" :expand-on-click-node="true">
        </el-tree>

      </el-col>
      </div>
    </div>
   <div style="width:80%;">
    <el-col  >
      <!-- <div id="branch_right" style="position:fixed;"> -->
      <!--工具条-->
      <el-col :span="24" class="toolbar" style="padding-bottom: 0px; margin-bottom:10px;">
        <el-form :inline="true" :model="filters" >
          <el-row :gutter="40">
          <el-col :xs="24" :sm="12" :md="6" :lg="6" style="margin-bottom:5px;">
            <el-input size="small" style="width:200px;" v-model="filters.channelId" placeholder="渠道编码"></el-input>
          </el-col>
          <el-col :xs="24" :sm="12" :md="6" :lg="6" style="margin-bottom:5px;">
            <el-input size="small" style="width:200px;" v-model="filters.mobile" placeholder="手机号码"></el-input>
          </el-col>
          <el-col :xs="24" :sm="12" :md="6" :lg="6" style="margin-bottom:5px;">
            <el-input size="small" style="width:200px;" v-model="filters.shopName" placeholder="店铺名称"></el-input>
          </el-col>
          <el-col :xs="24" :sm="12" :md="6" :lg="6" style="margin-bottom:5px;">
            <el-select v-model="filters.istopUser" size="small" clearable style="width:100%" placeholder="是否顶级">
                <el-option label="是" value="top"></el-option>
                <el-option label="否" value="nottop"></el-option>
            </el-select>
          </el-col>
        </el-row>
          <el-form-item style="float:right;">
            <el-button type="primary" class="button_style" size="small" @click="getLogs(true)" v-show="agentBranchQuery">查询</el-button>
            <el-button type="primary" class="button_style" size="small" @click="exportExcels" v-show="agentBranchExport">导出</el-button>
            <!-- <el-button type="primary" class="button_style" size="small" @click="editTrench">修改当前渠道</el-button> -->
            <el-button type="primary" class="button_style" size="small" @click="searchTrench" v-show="serPresentVisible">查询当前员工</el-button>
            <el-button type="primary" class="button_style" size="small" @click="addNext" v-show="addNextBtnVisible">添加下级员工</el-button>
          </el-form-item>
        </el-form>
      </el-col>
      <!--列表-->
      <el-table :data="branchs"  stripe border :height="winHeight-195" highlight-current-row style="width: 100%;">
        <el-table-column prop="userCode" align="center" label="用户编码" min-width="80">
        </el-table-column>
        <el-table-column prop="mobile" align="center" label="电话号码" min-width="80">
        </el-table-column>
        <el-table-column prop="userName" align="center" label="用户姓名" min-width="120">
        </el-table-column>
        <el-table-column label="操作" align="center" min-width="120" width="150">
          <template scope="scope">
            <!-- <el-col :xs="8" :sm="8" :md="8" :lg="8">
              <el-button type="warning" size="small" :disabled="commissionShow(scope.$index, scope.row)" @click="commission(scope.$index, scope.row)">授权产品</el-button>
            </el-col> -->
            <el-col :xs="8" :sm="8" :md="8" :lg="12">
              <el-button size="small" @click="handleDetail(scope.$index, scope.row)" v-show="chanelDetail">详情</el-button>
            </el-col>
            <el-col :xs="8" :sm="8" :md="8" :lg="12">
              <el-button type="warning" size="small" v-show="channelUpdate" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
            </el-col>
          </template>
        </el-table-column>
      </el-table>
      <!--工具条-->
      <el-col :span="24" class="toolbar">
        <!-- <el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button> -->
        <!-- <el-button type="danger" size="small">批量删除</el-button> -->
        <el-pagination style="float:right" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page" :page-sizes="[10, 20, 40, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
      </el-col>
      <!-- </div> -->
    </el-col>
    <!-- </div> -->
  </div>
</div>
    <!--添加下级渠道-->
    <el-dialog title="添加下级员工" size="large" v-model="addNextVisible" :close-on-click-modal="false">
      <el-form label-width="100px" :model="addNextForm" :rules="addNextFormRules" ref="addNextForm">
        <el-row>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="手机号码:" prop="mobile">
              <el-input id="mobile" v-model="addNextForm.mobile" :disabled="editAddNextDisable" style="width:100%;" auto-complete="off"></el-input>
              <!-- @blur="mobileChange" -->
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="24" :md="16" :lg="8">
            <el-form-item label="员工编码:" prop="employeeCode">
              <el-input v-model="addNextForm.employeeCode" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        <!-- v-show="userRealNameVisible" -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="真实姓名" prop="userRealName">
              <el-tooltip class="item" effect="dark" content="请输入真实姓名" placement="top">
                <el-input v-model="addNextForm.userRealName" auto-complete="off"></el-input>
              </el-tooltip>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="职级:" prop="roleType">
              <el-select size="small" clearable style="width:100%;" v-model="addNextForm.roleType" placeholder="请选择职级">
                <el-option v-for="(role,index) in roles" :key="index" :label="role.label" :value="role.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="证件类型:" prop="idType">
                <el-select size="small" clearable style="width:100%;height:150" v-model="  addNextForm.idType" placeholder="请选择证件类型">
                  <el-option label="身份证" value="1"></el-option>
                  <el-option label="统一社会信用代码" value="2"></el-option>
                </el-select>
              <!-- <template>
                <el-radio class="radio" :disabled="editAddNextDisable" v-model="addNextForm.idType" label="1">身份证</el-radio>
                <el-radio class="radio" :disabled="editAddNextDisable" v-model="addNextForm.idType" label="2">统一社会信用代码</el-radio>
              </template> -->
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="证件号码:" prop="idNumber">
              <el-input v-model="addNextForm.idNumber" :disabled="editAddNextDisable" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="用户类型:" prop="type">
              <template>
                <el-radio-group v-model="addNextForm.type" @change="userTypeChange">
                  <el-radio class="radio" label="0">内部用户</el-radio>
                  <el-radio class="radio" label="1">外部用户</el-radio>
                </el-radio-group>
              </template>
            </el-form-item>
          </el-col>
        </el-row> -->
       <!--  <el-row v-show="userNameVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="用户名" prop="userName">
              <el-tooltip class="item" effect="dark" content="请输入用户名" placement="top">
                <el-input v-model="addNextForm.userName" auto-complete="off"></el-input>
              </el-tooltip>
            </el-form-item>
          </el-col>
        </el-row> -->
        <!-- <el-row v-show='editPassBtnVisible'>
          <el-col :xs="20" :sm="20" :md="20" :lg="20">
            <el-form-item>
              <el-button size="small" type="primary" v-on:click="editPassBtn">修改密码</el-button>
            </el-form-item>
          </el-col>
        </el-row> -->
        <!-- <el-row v-show="editPassVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="原始密码:" prop="oldPassword">
              <el-input type="password" v-model="addNextForm.oldPassword" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
        <!-- <el-row v-show="editPassVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="11">
            <el-form-item label="新密码:" prop="password"> -->
              <!-- :disabled="editAddNextDisable" -->
              <!-- <el-input type="password" v-model="addNextForm.password" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
        <el-row >
        <!-- v-show="addNewPassVisible" -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="登录密码:" prop="password">
              <!-- :disabled="editAddNextDisable" -->
              <el-input type="password" v-model="addNextForm.password" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        <!-- </el-row>

        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="业务关系代码:" prop="agrementNo">
              <!-- :disabled="agrNoDisable" -->
              <el-input v-model="addNextForm.agrementNo" @blur="blurSelect" @change="changeSelectEdit" :disabled="agrNoDisable">
              </el-input>
            </el-form-item>
          </el-col>
        <!-- </el-row>
         <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="客户单位名称:" prop="code">
              <el-input :disabled="true" v-model="customerNameTemp" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row >
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="关系上属编码:">
              <el-input v-model="addNextForm.upUserCode" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item :label="refereeUser('code',addNextForm.comCode)" >
              <el-input v-model="addNextForm.comCode" :disabled="true" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item :label="refereeUser('name',addNextForm.comCode)" >
              <el-input v-model="addNextForm.upLevelName" :disabled="true" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="16" :lg="8">
            <el-form-item label="店铺名称:" prop="shopName">
              <el-input v-model="addNextForm.shopName" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="8">
            <el-form-item label="销售人名称和编码" v-show="sellShow">
              <!-- :disabled="agrNoDisable"  -->
              <el-select :disabled="agrNoDisable" v-model="selectdatas" clearable style="width:100%" @change="handleSelect" @visible-change="visibleSelect" placeholder="请选择">
                <el-option v-for="(item,index) in restaurants" :key="index" :label="item.value" :value="item.code">
                  <span style="float: left">{{ item.value }}</span>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="下级收益比例:" prop="baseRate">
              <el-input v-model.number="addNextForm.baseRate" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
       <!--  <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item>
             :disabled="canScoreDisable" -->
             <!--  <el-checkbox  v-model="addNextForm.canScore">下级收益获取方式为积分提现</el-checkbox> -->
              <!-- <el-checkbox v-model="addNextForm.canModify">允许手机端修改店铺配置信息</el-checkbox> -->
           <!--  </el-form-item>
          </el-col>
        </el-row>  -->
        <!-- <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item>
               @change="isBackUserChose(addNextForm.isBackUser)"
              <el-checkbox v-model="addNextForm.defaultAuth">订单查询权限</el-checkbox>
            </el-form-item>
          </el-col>
        </el-row> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="addNextVisible = false">取消</el-button>
        <el-button type="primary" @click.native="addNextSubmit" :loading="addLoading">提交</el-button>
      </div>
    </el-dialog>
    <!--添加下级渠道-->

    <!--修改下级渠道-->
    <el-dialog title="修改当前渠道" size="large" v-model="editTrenchVisible" :close-on-click-modal="false">
      <el-form label-width="100px" :model="trenchForm" ref="trenchForm" :rules="trenchFormFormRules">
        <!-- :rules="trenchFormFormRules" -->
        <el-row>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="手机号码:" prop="mobile">
              <el-input v-model="trenchForm.mobile" style="width:100%;" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="店铺名称:" prop="shopName">
              <el-input v-model="trenchForm.shopName" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="真实姓名" prop="userRealName">
              <!-- :disabled="userIdDisable" -->
              <el-input v-model="trenchForm.userRealName" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
          
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="职级:">
              <el-select size="small" clearable style="width:100%;" @change="rankTypeChange" v-model="trenchForm.roleType" placeholder="请选择职级">
                <el-option v-for="(role,index) in roles" :key="index" :label="role.label" :value="role.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="证件类型:" prop="idType">
              <template>
                <el-radio class="radio" v-model="trenchForm.idType" label="1">身份证</el-radio>
                <el-radio class="radio" v-model="trenchForm.idType" label="2">统一社会信用代码</el-radio>
              </template>
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="证件号码:" prop="idNumber">
              <el-input v-model="trenchForm.idNumber" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
       <!--  <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="用户类型:" prop="type">
              <template>
                <el-radio-group v-model="trenchForm.type" @change="userTypeChange" :checked="checked"> -->
                  <!-- :disabled="userIdDisable" -->
                 <!--  <el-radio label="0">内部用户</el-radio>
                  <el-radio label="1">外部用户</el-radio>
                </el-radio-group>
              </template>
            </el-form-item>
          </el-col>
        </el-row> -->
        <!-- <el-row v-show="userNameVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="20">-->
            <!-- <el-form -item label="用户名" prop="userName"> -->
              <!-- :disabled="userIdDisable"  -->
              <!-- <el-input v-model="trenchForm.userId" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
        <el-row >
        <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="关系上属编码:">
              <el-input v-model="trenchForm.upUserCode" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        <!-- v-show="userRealNameTrenVisible" -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item :label="refereeUser('code',trenchForm.comCode)" prop="comCode">
              <el-input v-model="trenchForm.comCode" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item :label="refereeUser('name',trenchForm.comCode)">
              <el-input v-model="trenchForm.upLevelName" :disabled="true" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- <el-row>
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="角色:" prop="roleType">
              <template>
                <el-radio-group v-model="trenchForm.roleType">
                  <el-radio class="radio" label="9">渠道经理</el-radio>
                  <el-radio class="radio" label="11">渠道用户</el-radio>
                </el-radio-group>
              </template>
            </el-form-item>
          </el-col>
        </el-row> -->

        
        <el-row>
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <!-- :disabled="isTopChannel()" -->
            <el-form-item label="业务关系代码:" prop="agrementNo">
              <el-input v-model="trenchForm.agrementNo" :disabled="isTopChannel()" style="width:100%" @blur="blurSelectEdit" @change="changeSelectEdit">
              </el-input>
            </el-form-item>
          </el-col>
        <!-- </el-row>
        <el-row v-show="sellShow"> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8" v-show="sellShow">
            <el-form-item label="销售人及编码:">
              <!-- :disabled="isTopChannel()" -->
              <el-select v-model="selectdatas" clearable style="width:100%" :disabled="isTopChannel()" @change="handleSelectEdit" @visible-change="visibleSelectEdit" placeholder="请选择">
                <el-option v-for="(item,index) in restaurants" :key="index" :label="item.value" :value="item.code">
                  <span style="float: left">{{ item.value }}</span>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
       <!--  </el-row>
        <el-row> -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="客户单位名称:" prop="code">
              <el-input v-model="customerNameTemp" :disabled="true" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row >
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="所属机构编码:" >
              <el-input v-model="trenchForm.sysBranchCode" :disabled="true" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
     <!--    </el-row>
        <el-row > -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8">
            <el-form-item label="所属机构名称:" >
              <el-input v-model="trenchForm.branchName" :disabled="true" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="16" :lg="8">
            <el-form-item label="员工编码:"> 
              <el-input v-model="trenchForm.employeeCode"  style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
          
        </el-row>
        <el-row v-show="registerUrlVisible">
          <el-col :xs="24" :sm="20" :md="16" :lg="8" v-show="rankTypeChangeAble">
            <el-form-item label="职级变更类型:" prop="rankChangeType">
              <el-select size="small" clearable style="width:100%;" v-model="trenchForm.rankChangeType" placeholder="请选择职级变更类型">
                <el-option label="入司" value="1"></el-option>
                <el-option label="转正" value="2"></el-option>
                <el-option label="加盟" value="3"></el-option>
                <el-option label="复职" value="4"></el-option>
                <el-option label="升职" value="5"></el-option>
                <el-option label="降职" value="6"></el-option>
                <el-option label="免职" value="7"></el-option>
                <el-option label="辞职" value="8"></el-option>
                <el-option label="转岗" value="9"></el-option>
                <el-option label="调职" value="10"></el-option>
                <el-option label="转职" value="11"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row >
          <el-col :xs="24" :sm="20" :md="16" :lg="8" v-show='editPassBtnVisible'>
            <el-form-item>
              <el-button size="small" type="primary" v-on:click="editPassBtn">修改密码</el-button>
            </el-form-item>
          </el-col>
        <!-- </el-row> -->
       <!--  <el-row v-show="editPassVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="20">
            <el-form-item label="原始密码:" prop="oldPassword">
              <el-input type="password" v-model="trenchForm.oldPassword" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
        <!-- <el-row > -->
          <el-col :xs="24" :sm="20" :md="16" :lg="8" v-show="editPassVisible">
            <el-form-item label="新密码:" prop="password">
              <!-- :disabled="editAddNextDisable" -->
              <el-input type="password" v-model="trenchForm.password" style="width:100%;" auto-complete="off">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="editCancel">取消</el-button>
        <el-button type="primary" @click.native="editSubmit" :loading="addLoading">确认</el-button>
      </div>
    </el-dialog>
    <!--修改下级渠道-->

    <!--授权产品界面-->
  <!-- <el-dialog title="渠道产品授权" v-model="commissionFormVisible" :close-on-click-modal="false">
      <el-row style="margin-bottom:20px;">
        <el-collapse>
          <el-collapse-item title="已选择产品" name="1">
            <div v-for="(item,index) in commissionsels" :key="index" >
              <span style="float: left"> {{ item.productname}} ,</span>
            </div>
          </el-collapse-item>
        </el-collapse>
      </el-row>
      <el-row>
        <el-table :data="commissiondata" stripe border :height="winHeight-320" v-loading="commissiondataLoading" @select-all="commissionselsAll" @select="commissionselsChange"  highlight-current-row ref="producttable">
          <el-table-column align="center" type="selection" width="55">
          </el-table-column>
          <el-table-column align="center" prop="productname" label="产品名称" min-width="180" show-overflow-tooltip>
          </el-table-column>
          <el-table-column align="center" prop="productEname" label="产品英文名" min-width="180" show-overflow-tooltip>
          </el-table-column>
        </el-table>
        <el-col :span="24" class="toolbar">
          <el-pagination style="float:right" @size-change="commissionSizeChange" @current-change="commissionCurrentChange" :current-page="commissionpage" :page-sizes="[10,20,40]" :page-size="commissionpageSize" layout="total, sizes, prev, pager, next, jumper" :total="commissiontotal">
          </el-pagination>
        </el-col>
      </el-row>
      <div slot="footer" align="center" class="dialog-footer">
        <el-button @click.native="commissionCancel">取消</el-button>
        <el-button type="primary" @click.native="commissionSubmit" :loading="commissionLoading">提交</el-button>
      </div>
    </el-dialog> -->



    <!--渠道信息查询-->
    <el-dialog title="员工信息查询" v-model="searchTrenchVisible" :close-on-click-modal="false">
      <el-form :model="searchTrenchForm" label-width="100px" ref="searchTrenchForm">
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">员工姓名:</label>
            <span class="examineFonts">{{searchTrenchForm.userName}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">手机号码:</label>
            <span class="examineFonts">{{searchTrenchForm.mobile}}</span>
          </el-col>
          
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">用户编码:</label>
            <span class="examineFonts">{{searchTrenchForm.userCode}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">员工编码:</label>
            <span class="examineFonts">{{searchTrenchForm.employeeCode}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">证件类型:</label>
            <span class="examineFonts">{{searchTrenchForm.idType}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">证件号码:</label>
            <span class="examineFonts">{{searchTrenchForm.idNumber}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">是否店主:</label>
            <span class="examineFonts">{{searchTrenchForm.storeFlag}}</span>
          </el-col> 
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">所属机构:</label>
            <span class="examineFonts">{{searchTrenchForm.branchCode}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">销售人名称:</label>
            <span class="examineFonts">{{searchTrenchForm.saleName}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">销售人编码:</label>
            <span class="examineFonts">{{searchTrenchForm.saleCode}}</span>
          </el-col>
        </el-row>
        <el-row>
         <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">层级渠道名称:</label>
            <span class="examineFonts">{{searchTrenchForm.shopName}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">业务关系代码:</label>
            <span class="examineFonts">{{searchTrenchForm.agrementNo}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码渠道编码:</label>
            <span class="examineFonts">{{searchTrenchForm.channelCode}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码渠道名称:</label>
            <span class="examineFonts">{{searchTrenchForm.channelName}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码客户类型:</label>
            <span class="examineFonts">{{searchTrenchForm.channelType}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码客户名称:</label>
            <span class="examineFonts">{{searchTrenchForm.customName}}</span>
          </el-col>
        </el-row>
        <el-row v-show="registerUrlVisible">
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">用户类型:</label>
            <span class="examineFonts">{{searchTrenchForm.userType}}</span>
          </el-col>
          <!-- <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">下级收益比例:</label>
            <span class="examineFonts">{{searchTrenchForm.baseRate}}</span>
          </el-col> -->
        </el-row>
       <!--  <el-row v-show="registerUrlVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" class="detaillabel">
            <label class="detailLabel">下级注册链接:</label>
            <span class="examineFonts">{{registerUrl}}</span>
          </el-col>
        </el-row> -->
       <!--  <el-row>
          <el-col :xs="20" :sm="20" :md="20" :lg="20" :offset="4" class="detaillabel">
            <el-checkbox v-model="searchTrenchForm.canScore"  disabled>下级收益获取方式为积分提现</el-checkbox> -->
            <!-- <el-checkbox v-model="searchTrenchForm.canModify" disabled>允许手机端修改店铺配置信息</el-checkbox> -->
          <!-- </el-col>
        </el-row> -->
        <el-row v-show="registerUrlVisible">
          <el-col :xs="20" :sm="20" :md="20" :lg="20" :offset="4" class="detaillabel">
            <el-button type="warning" @click="preview">二维码注册</el-button>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" align="center" class="dialog-footer">
        <el-button @click.native="cancel">取消</el-button>
      </div>
    </el-dialog>



    <!--渠道信息查询-->

    <!--详情界面-->
    <el-dialog title="详情" v-model="detailFormVisible" :close-on-click-modal="false">
      <el-form :model="detailForm" label-width="100px" ref="detailForm">
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">员工姓名:</label>
            <span class="examineFonts">{{detailForm.userName}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">手机号码:</label>
            <span class="examineFonts">{{detailForm.mobile}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">用户编码:</label>
            <span class="examineFonts">{{detailForm.userCode}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">员工编码:</label>
            <span class="examineFonts">{{detailForm.employeeCode}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">职级:</label>
            <span class="examineFonts">{{this.formatRole(detailForm.roleType)}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系上属:</label>
            <span class="examineFonts">{{detailForm.upUserCode}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">证件类型:</label>
            <span class="examineFonts">{{detailForm.idType}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">证件号码:</label>
            <span class="examineFonts">{{detailForm.idNumber}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">是否店主:</label>
            <span class="examineFonts">{{detailForm.storeFlag}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">所属机构:</label>
            <span class="examineFonts">{{detailForm.branchCode}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">销售人名称:</label>
            <span class="examineFonts">{{detailForm.saleName}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">销售人编码:</label>
            <span class="examineFonts">{{detailForm.saleCode}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">层级渠道名称:</label>
            <span class="examineFonts">{{detailForm.shopName}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">业务关系代码:</label>
            <span class="examineFonts">{{detailForm.agrementNo}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码渠道编码:</label>
            <span class="examineFonts">{{detailForm.channelCode}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码渠道名称:</label>
            <span class="examineFonts">{{detailForm.channelName}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码客户类型:</label>
            <span class="examineFonts">{{detailForm.channelType}}</span>
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">关系代码客户名称:</label>
            <span class="examineFonts">{{detailForm.customName}}</span>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">用户类型:</label>
            <span class="examineFonts">{{detailForm.userType}}</span>
          </el-col>
        </el-row>
       <!--  <el-row v-show="registerUrlVisible">
          <el-col :xs="24" :sm="24" :md="12" :lg="12" class="detaillabel">
            <label class="detailLabel">下级收益比例:</label>
            <span class="examineFonts">{{detailForm.baseRate}}</span>
          </el-col>
        </el-row> -->
        <!-- <el-row v-show="registerUrlVisible">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" class="detaillabel">
            <label class="detailLabel">下级注册链接:</label>
            <span class="examineFonts">{{registerUrl}}</span>
          </el-col>
        </el-row> -->
        <!-- <el-row>
          <el-col :xs="20" :sm="20" :md="20" :lg="20" :offset="4" class="detaillabel">
            <el-checkbox v-model="detailForm.canScore" disabled>下级收益获取方式为积分提现</el-checkbox> -->
            <!-- <el-checkbox v-model="detailForm.canModify" disabled>允许手机端修改店铺配置信息</el-checkbox> -->
         <!--  </el-col>
        </el-row> -->
        <el-row v-show="registerUrlVisible">
          <el-col :xs="20" :sm="20" :md="20" :lg="20" :offset="4" class="detaillabel">
            <el-button type="warning" @click="preview">二维码注册</el-button>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" align="center" class="dialog-footer">
        <el-button @click.native="cancel">取消</el-button>
      </div>
    </el-dialog>
    <!-- 二维码预览 -->
    <el-dialog size="tiny" v-model="qrcodeVisible" align="center" :close-on-click-modal="false">
      <el-row>
        <el-col :xs="12" :sm="24" :md="12" :lg="24" class="qrcodeLabel">
            <span class="examineFonts">{{detailForm.shopName}}</span>
        </el-col>
      </el-row>
      <el-row>
        <div id="qrcode" style="width:240px; height:240px;">

        </div>
      </el-row>
    </el-dialog>
  </section>
</template>

<script>
import util from '../../common/js/util'

import commons from '../../common/js/common'
//import NProgress from 'nprogress'
import { mapState, mapActions } from 'vuex'
import { findBySql, updatePwdByUserCode, levelList, getSaleName, createChannelUser, updateChannelUser, isMergeUser, nextChannelList,roleList, findByAgreementNo, treeNextChannelList, thisChannel,userList,setShopPro,topChannelUser ,orderAuth,isHasIdnumber,channelProductList} from '../../api/api';
import QRCode from 'qrcodejs2';
import encode from '../../common/js/encryption';
export default {
  data() {

    var phone = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('手机号码不能为空'));
      }
      else {
        if (!(/^\d{11}$/.test(value))) {
          return callback(new Error('请输入正确的手机号码'));
        }
        else {
          return callback();
        }
      }
    };
    var IDCardValid = (rule, value, callback) => {
      if (this.addNextForm.idType == '1' || this.trenchForm.idType == '1') {
        if (!value) {
          return callback(new Error('身份证号码不能为空'));
        }
        else {
          if (!(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value))) {
            return callback(new Error('请输入正确的身份证号码'));
          }
          else {
            if (this.idNumberVisible) {
              console.log("==========================");
              let para = new FormData();
              para.append('idNumber', value);
              isHasIdnumber(para).then((res) => {
                if (res.data.state==1) {
                  this.$message({
                    message: res.data.result,
                    type: 'success'
                  }); 
                }
              });
            }
             return callback();
          }
        }
      } else {
        let para = new FormData();
            para.append('idNumber', value);
            isHasIdnumber(para).then((res) => {
              if (res.data.state==1) {
                this.$message({
                  message: res.data.result,
                  type: 'success'
                });
              }
            });
        return callback();
      }
    };
    var helpText = (rule, value, callback) => {
      if (value==0||value=='0') {
        return callback();
      }
      if (commons.isEmpty(value)) {
        return callback(new Error('比例不能为空'));
      } else if (!(/^-?\d+(\.\d{1,6})?$/.test(value))) {
        return callback(new Error('小数不能超过6位'));
      }
      else {
        if (value > 1) {
          return callback(new Error('比例不能大于1'));
        }
        else {
          return callback();
        }
      }
    };
    var editHelpText = (rule, value, callback) => {
      if (this.registerUrlVisible) {
          if (value==0||value=='0') {
            return callback();
          }
          if (commons.isEmpty(value)) {
            return callback(new Error('比例不能为空'));
          } else if (!(/^-?\d+(\.\d{1,6})?$/.test(value))) {
            return callback(new Error('小数不能超过6位'));
          }
          else {
            if (value > 1) {
              return callback(new Error('比例不能大于1'));
            }
            else {
              return callback();
            }
          }
      }else{
          return callback();
      }
    };
    var realName = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('真实姓名不能为空'));
      } else if (!(/^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/.test(value))) {
        return callback(new Error('请输入格式正确的中文姓名'));
      }
      else {
        return callback();
      }
    };
    var rankChange = (rule, value, callback) => {
      if (this.rankTypeChangeAble) {
        if (!value) {
          return callback(new Error('请选择职级变更类型'));
        }
        else {
          return callback();
        }
      }else{
        return callback();
      }
    };

    var validateMobileno = (rule, value, callback) => {

      if (!value) {

        return callback(new Error('手机号码不能为空'));
        // /^1[3|4|5|8|7][0-9]\d{4,8}$/
      } else if (!( /^\d{11}$/.test(value))) {
        return callback(new Error('手机号格式不正确'));
      }
      else {
        if (!this.validateMobile) {

          let para = new FormData();
          para.append('mobile', value);
          para.append('comCode', this.comCode);
          isMergeUser(para).then((res) => {
            if (res.data.result) {
              this.$message({
                message: "该手机已被使用！",
                type: 'error'
              });


              // let qudata = res.data.result;
              // console.log(this.comCode);
              // if (this.comCode==qudata.userCode) {
              //     this.$message({
              //       message: "该手机号用户不能成为自己下级",
              //       type: 'error'
              //     });
              // }else{
              //   this.addNextForm.shopName = qudata.shopName;
              //   this.addNextForm.idType = qudata.idType;
              //   this.addNextForm.idNumber = qudata.idNumber;
              //   this.addNextForm.agrementNo = qudata.agrementNo;
              //   this.addNextForm.baseRate = qudata.baseRate;
              //   if (qudata.canScore == '1') {
              //     this.addNextForm.canScore = true;
              //   } else {
              //     this.addNextForm.canScore = false;
              //   }
              //   if (qudata.canModify == '1') {
              //     this.addNextForm.canModify = true;
              //   } else {
              //     this.addNextForm.canModify = false;
              //   }
              //   // this.addNextForm.canModify = qudata.canModify;
              //   // this.addNextForm.canScore = qudata.canScore;
              //   this.addNextForm.userRealName = qudata.userName;
              //   this.saleNameTrench = qudata.saleName;
              //   this.selectData();
              //   setTimeout(() => {
              //     this.selectdatas = this.seltValue;
              //     console.log(this.selectdatas)
              //   }, 1500);
              //   this.editAddNextDisable = true;
                
              //   if (this.comCode) {
              //     let brNo = this.comCode.substring(0, 2);
              //     if (brNo == 'BS' || brNo == 'WX') {
              //       this.agrNoDisable = true;
              //     }
              //     // if (this.canScoreDisable) {
              //     //   this.canScoreDisable=true;
              //     // }else{
              //     //   this.canScoreDisable=false;
              //     // }
              //   }
              //   this.ruleOfAddNext = false;
              //   this.$message('该手机用户已存在！');
              //   this.editPassBtnVisible = true;
              //   this.addNewPassVisible = false;
              // }
              // this.addNewPassVisible = false;
               }else {
                this.ruleOfAddNext = true;
                this.editPassBtnVisible = false;
                this.addNewPassVisible = true;
              }
            // if (res.data.state != 0) {
            //   this.$confirm('存在该号码的用户！是否合并,若不合并将不能继续添加渠道', '合并', {}).then(() => {
            //     this.addNextForm.isMergeUser = 1;
            //   }).catch(() => {
            //     this.addNextVisible = false;
            //   });
            // }
          });
          this.validateMobile = true;
        }
        return callback();
      }

    };
    return {
      filters: {
        shopName: '',
        channelId: '',
        branchNo: '',
        istopUser:'',
        mobile:''
      },
      branchTitle: '',
      data: [],
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      selectdatas: '',
      restaurants: [{
        value: '',
        code: ''
      }],
      branchs: [],
      // commissiondata: [{
      //   code: '1',
      //   name: '2',
      //   nextperson: '1'
      // }, {
      //   code: '1',
      //   name: '2',
      //   nextperson: '1'
      // }, {
      //   code: '1',
      //   name: '2',
      //   nextperson: '1'
      // }],
      Logs: [],
      lists: [],
      titles: [],
      // commissiondata: [],
      exportTotal: 0,
      total: 0,
      page: 1,
      pageSize: 10,
      // commissionpage: 1,
      // commissionpageSize: 10,
      // commissiontotal: 0,
      loading: '',
      editindex: '',
      idNumberVisible:true,
      listLoading: false,
      editLoading: false,
      addLoading: false,
      matchLoading: false,
      examineLoading: false,
      // commissionLoading: false,
      addFormVisible: false,
      registerUrlVisible:false,
      detailFormVisible: false,
      examineFormVisible: false,
      editFormVisible: false,
      matchFormVisible: false,
      userNameVisible: false,
      userRealNameVisible: false,
      agentBranchQuery: false,
      // commissionsels:[],
      authListSels:[],
      roles: [],
      userid: '',
      addNextVisible: false,//显示添加下级渠道界面
      editTrenchVisible: false,//显示修改下级渠道界面
      searchTrenchVisible: false,//显示查询渠道界面
      sellShow: false,//显示业务关系代码的销售人员编码
      qrcodeVisible: false, //二维码预览
      passwordVisible: true,//显示登录密码
      editAddNextDisable: false,//添加下级渠道某些栏是否可编辑
      agrNoDisable: false,
      // canScoreDisable:false,
      userIdDisable: true,
      ruleOfAddNext: true,
      oldPassVisible: false,
      addNextChannel: false,
      agentBranchExport: false,
      agentBranchQuery: false,
      channelUpdate: false,
      rankTypeChangeAble:false,
      thisChannel: false,
      chanelDetail: false,
      reduceAuthList: false,
      userRealNameTrenVisible: false,
      comCode: '',
      comLable: '',
      seltValue: '',
      saleNameTrench: '',
      // commissionPara:{
      //     userCodes: '',
      //     storeConfig: []
      //   },
      // commissiontotal: 0,
      // commissionpage: 1,
      // commissionpageSize: 10,
      // commissiondataLoading:false,
      // commissionFormVisible: false,//授权产品界面是否显示
      serPresentVisible: false,//是否显示查询当前渠道，为分公司就不显示，为下级渠道就显示
      // commissionPresentVisible:false,//授权产品按钮是否显示
      addNextBtnVisible: false,//是否显示添加下级渠道，为总公司则不显示
      channelCodeTemp: '',// 渠道编码--
      channelNameTemp: '',
      customerTypeTemp: '',// 关系代码客户类型--
      customerNameTemp: '',
      editPassVisible: false,
      editPassBtnVisible: false,
      validateMobile: false,
      addNewPassVisible: false,
      branchTemp: '',
      roleCode:'',
      agentNameTemp: '',
      orgCodeTemp: '',
      licenceNoTemp: '',
      addNextForm: {
        // userid: '',
        userName: '',// 姓名
        nickName: '',// 昵称
        idType: '',    //证件类型
        idNumber: '',// 证件号
        type: 1,//用户类型 0内部用户，1外部用户
        password: '',// 密码
        imgCode: '', // 图形码
        mobileCode: '',// 手机验证码
        mobile: '',  // 手机号
        userRealName: '',
        refereeId: '',// 分享ID
        refereePro: '',// 分享产品ID
        storeFlag: '',// 是否开店
        comCode: '',	 //所属部门--上级
        upLevelName:'',
        branchCode: '',// 机构编码
        agrementNo: '',// 业务关系代码
        agrementName: '',// 代理名称--
        channelCode: '',// 渠道编码--
        channelName: '',// 渠道名称--
        saleCode: '',// 销售编码--
        saleName: '',// 销售名称--
        orgCode: '',// 组织机构代码   6
        licenceNo: '',// 营业执照号   7
        customerType: '',// 关系代码客户类型--
        customerName: '',// 关系代码客户名称--
        baseRate: '',
        canScore: true,
        canModify: '',
        defaultAuth: '',
        oldPassword: '',
        upUserCode:'',
        // isBackUser: '',
        // isMergeUser: 0,
        roleType: 1//角色 0是渠道经理  1渠道用户
      },//添加下级渠道界面参数
      checked: false,
      addNextFormRules: {
        mobile: [{ required: true, validator: validateMobileno, trigger: 'blur' }],
        channelName: [{ required: true, message: '请输入渠道名称', trigger: 'blur' }],
        idType: [{ required: true, message: '请选择证件类型', trigger: 'blur' }],
        type: [{ required: true, message: '请选择用户类型', trigger: 'blur' }],
        userName: [{ required: true, message: '请输入员工姓名', trigger: 'blur' }],
        idNumber: [{ required: true, validator: IDCardValid, trigger: 'blur' }],
        password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
        agrementNo: [{ required: true, message: '请输入业务关系代码', trigger: 'blur' }],
        baseRate: [{ required: true, validator: helpText, trigger: 'blur' }],
        roleType: [{ required: true, message: '请选择职级类型',}],
        shopName: [{ required: true, message: '请输入渠道名称', trigger: 'blur' }],
        employeeCode: [{ required: true, message: '请输入员工编码', trigger: 'blur' }],
        // userRealName: [{ required: this.userRealNameVisible, validator: realName, trigger: 'blur' }],
        userRealName: [{ required: true, message: '请输入真实姓名', trigger: 'blur' }],
      },
      trenchFormFormRules: {
        comCode: [{ required: true, message: '请输入上级渠道ID', trigger: 'blur' }],
        mobile: [{ required: true, validator: phone, trigger: 'blur' }],
        idType: [{ required: true, message: '请选择证件类型', trigger: 'blur' }],
        roleType: [{ required: true, message: '请选择职级类型', trigger: 'blur' }],
        type: [{ required: true, message: '请选择用户类型', trigger: 'blur' }],
        idNumber: [{ required: true, validator: IDCardValid, trigger: 'blur' }],
        shopName: [{ required: true, message: '请输入渠道名称', trigger: 'blur' }],
        comCode: [{ required: true, message: '请输入上级渠道ID', trigger: 'blur' }],
        agrementNo: [{ required: true, message: '请输入业务关系代码', trigger: 'blur' }],
        baseRate: [{ required: true, validator: editHelpText, trigger: 'blur' }],
        // userRealName: [{ required: this.userRealNameTrenVisible, validator: realName, trigger: 'blur' }],
        rankChangeType:[{ required: true, validator: rankChange, trigger: 'blur' }],
        userRealName: [{ required: true, message: '请输入真实姓名', trigger: 'blur' }],
        customerNameTemp: [{ required: true, message: '请输入客户单位名称', trigger: 'blur' }],
      },
      trenchForm: {},
      searchTrenchForm: {},
      examineForm: {},
      detailForm: {},
      IsShow: false,
      uploadPass: false,
      // rootUrl: location.protocol + "//" + location.hostname + "/#/sticcxb/registerchannel",
      rootUrl: location.protocol + "//" + location.hostname + "/sticcxb/#/sticcxb/registeraccept",
      registerUrl: "",
    }
  },
  computed: mapState([
    'winWidth',
    'winHeight',
    'hotAreaList'
  ]),
  methods: {
    ...mapActions([
      'findHotAreaList'
    ]),
    cellStyle(row, rowIndex, columnIndex) {
    },
    formatContent: function (row, column) {
      return JSON.stringify(row);
    },
    formatRole: function (row) {
      console.log();
      for (let i in this.roles) {
        if (this.roles[i].id==row) {
          return this.roles[i].label;
        }
      }
      
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getLogs(true);
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getLogs(true);
    },
    // commissionSizeChange(val) {
    //   this.commissionpageSize = val;
    // },
    // commissionCurrentChange(val) {
    //   this.commissionpage = val;
    // },
    refereeUser: function (str,code) {
      // console.log(str);
      // console.log(code);
      if (code) {
        if (code.substring(0, 2) == 'BS' || code.substring(0, 2) == 'WX') {
            if (str=="code") {
               return "介绍人编码:";
            }else{
              return "介绍人名称:";
            }
        } else {
          if (str=="code") {
               return "直接机构编码:";
            }else{
              return "直接机构名称:";
            }
        } 
      }
    },
    editPassBtn: function () {
      if (this.editPassVisible) {
        this.editPassVisible = false;
      }else{
        this.editPassVisible = true;
      }
    },

    // 业务关系代码-----销售人员及编码---添加下级渠道
    handleSelect() {
      console.log(this.selectdatas)
      console.log(this.restaurants)
      for (var i in this.restaurants) {
        if (this.restaurants[i].code == this.selectdatas && this.selectdatas != "") {
          this.addNextForm.saleName = this.restaurants[i].value.split('-')[0];
          this.addNextForm.saleCode = this.restaurants[i].code;
        }
      }
    },
    // 业务关系代码-----销售人员及编码-----修改下级渠道
    handleSelectEdit() {
      console.log(this.selectdatas)
      console.log(this.restaurants)
      for (var i in this.restaurants) {
        if (this.restaurants[i].code == this.selectdatas && this.selectdatas != "") {
          this.trenchForm.saleName = this.restaurants[i].value.split('-')[0];
          this.trenchForm.saleCode = this.restaurants[i].code;
        }
      }
    },
    // commission: function (index, row) {
    //     this.sels = [];
    //     this.commissiondata = [];
    //     this.commissionsels = [];
    //     this.reduceAuthList = false;
    //     this.commissionPara.storeConfig = [];
    //     this.authListSels=[];
    //     this.commissionFormVisible = true;
    //     this.commissionPara.userCodes=row.userCode;
    //     this.Getproducts();
    // },
    // commissionShow: function (index, row) {
    //     if (row.comCode.substring(0, 2) == 'BS' || row.comCode.substring(0, 2) == 'WX') {
    //       return true; 
    //     } else {
    //       return false;
    //     } 
    // },
    // commissionCancel:function () {
    //   this.commissionFormVisible =false;
    //   this.sels = [];
    //   this.commissiondata = [];
    //   this.commissionsels = [];
    //   this.reduceAuthList = false;
    //   this.commissionPara.storeConfig = [];
    //   this.authListSels=[];
    //   this.$refs.producttable.clearSelection();
    // },
    editCancel:function () {
      console.log('editCancel.....');
      this.editTrenchVisible = false;
      this.rankTypeChangeAble = false;
      this.trenchForm.roleType='';
      console.log(this.trenchForm.roleType);
    },
    // commissionSubmit: function () {
    //   console.log(this.commissionsels);
    //   for (var i in this.commissionsels) {
    //     this.commissionPara.storeConfig.push({
    //       productEname:this.commissionsels[i].productEname,
    //       productName: this.commissionsels[i].productname,
    //       productId: parseInt(this.commissionsels[i].id),
    //     });
    //   }
    //   this.$confirm('确认提交吗？', '提示', {}).then(() => {
    //     this.commissionLoading = true;
    //     setShopPro(this.commissionPara).then((res) => {
    //       if (res.data.success) {
    //         this.$message({
    //           message: '提交成功',
    //           type: 'success'
    //         });
    //         this.commissionFormVisible = false;
    //         this.sels = [];
    //         this.commissiondata = [];
    //         this.commissionsels = [];
    //         this.reduceAuthList = false;
    //         this.authListSels=[];
    //         this.commissionPara.storeConfig = [];
    //         this.rateData = [];
    //         this.getcustoms(true);
    //       }
    //       else {
    //         this.$message({
    //           message: res.data.result,
    //           type: 'error'
    //         });
    //       }
    //       this.commissionLoading = false;
    //     }).catch(() => {
    //       this.commissionLoading = false;
    //     });
    //   });
    // },
    visibleSelect(bool) {
      if (bool) {
        this.selectData();
      }
    },
    //  commissionSizeChange(val) {
    //   this.commissionpageSize = val;
    //   this.Getproducts();
    // },
    // commissionCurrentChange(val) {
    //   this.commissionpage = val;
    //   this.Getproducts();
    // },
    visibleSelectEdit(bool) {
      if (bool) {
        this.selectDataEdit();
      }
    },
    blurSelect(Event) {
      // this.selectdatas = "";
      this.selectData();
    },
    blurSelectEdit(Event) {
      this.selectDataEdit();
    },
    rankTypeChange(Event) {
      console.log(this.roleCode)
      if (this.trenchForm.roleType!=this.roleCode){
        console.log(this.trenchForm.roleType)
          this.rankTypeChangeAble = true;
      }
    },
    changeSelectEdit(Event) {
      this.restaurants=[];
      this.seltValue = '';
      this.selectdatas ='';
    },
    getSale: function (para) {
      this.restaurants=[];
      this.seltValue = '';
      getSaleName(para).then((res) => {
        let data = res.data.result.sealesPersos;
        if (data.length > 0) {
          for (var i in data) {
            this.restaurants.push({
              value: data[i].saleName + '-' + data[i].saleVocationCardNo,
              code: data[i].saleVocationCardNo
            });
            if (data[i].saleName == this.saleNameTrench) {
              this.seltValue = data[i].saleVocationCardNo;
              console.log(this.seltValue);
              this.selectdatas = data[i].saleVocationCardNo;
            }
          }
        }

      }).catch(() => {
        this.$message({
          message: '查询销售人异常',
          type: 'warning'
        });
      });
    },
    selectData() {
      this.restaurants=[];
      this.selectdatas = '';
      if (this.addNextForm.agrementNo) {
        let _this = this;
        let para = new FormData();
        para.append('agreementCode', _this.addNextForm.agrementNo);
        this.getAgreementNo(para);
        this.getSale(para);
      }
    },
    //加载产品列表
    // Getproducts: function (userCode) {
    //   this.commissiondata = [];
    //   // this.commissionsels = [];
    //   let productlist = [];
    //   let para = new FormData();
    //   para.append("pageSize", this.commissionpageSize);
    //   para.append("pageNumber", this.commissionpage);
    //   para.append("userCode", this.commissionPara.userCodes);
    //   this.commissiondataLoading = true;
    //   channelProductList(para).then((res) => {
    //     if (res.data.success) {
    //       this.commissiondataLoading = false;
    //       this.commissiontotal = res.data.result.totalElements;
    //       productlist = res.data.result.list;
    //       for (var i in productlist) {
    //         this.commissiondata.push({
    //           id: productlist[i].id,
    //           productname: productlist[i].productCname,
    //           productEname: productlist[i].productEname,
    //         });
    //       }
    //       // this.$refs.producttable.clearSelection();

    //       //勾选中已经授权的产品
    //       if (res.data.result.auth) {
    //         var authList = res.data.result.auth;
    //         if(commons.isEmpty(this.authListSels)&&!this.reduceAuthList){
    //           this.authListSels=authList;
    //         }
    //         setTimeout(() => {
    //         for (var n in this.authListSels) {
    //           if (this.commissionsels.length>0&&!this.commissionsels.find(d=>d.id==this.authListSels[n].productId)) {
    //               this.commissionsels.push({
    //                 productEname:this.authListSels[n].productEname,
    //                 productname: this.authListSels[n].productCname,
    //                 id: this.authListSels[n].productId
    //             });
    //           }else{
    //               this.commissionsels.push({
    //                   productEname:this.authListSels[n].productEname,
    //                   productname: this.authListSels[n].productCname,
    //                   id: this.authListSels[n].productId
    //               });
    //             }
    //         }
    //         }, 200);
    //       }
    //        setTimeout(() => {
    //           if (this.commissionsels) {
    //               for (var i in this.commissiondata) {
    //                 if (this.commissionsels.find(d=>d.id==this.commissiondata[i].id)) {
    //                   this.$refs.producttable.toggleRowSelection(this.commissiondata[i], true);
    //                 }
    //               }
    //           }
    //        }, 200);
    //     }
    //     else {
    //       this.commissiondataLoading = false;
    //     }
    //   }).catch(() => {
    //     this.commissiondataLoading = false;
    //   });
    // },
    
    helptext: function (value) {
      if (value == null || value == " " && !value == '0' || value.length == 0) {
        return '比例不能为空';
      }
      else if (!(/^-?\d+(\.\d{1,6})?$/.test(value))) {
        return '小数不能超过6位';
      }
      else if (value > 1) {
        return '比例不能大于1';
      }
      else {
        return '';
      }
    },
    // commissionselsChange: function (sels, s) {
    //   console.log(sels)
    //   var temp1 = false;
    //   var temp2 = false;
    //   if (this.commissionsels.length > 0) {
    //     temp2 = sels.find(d => d.id == s.id);
    //     for (var i in this.commissionsels) {
    //       if (this.commissionsels[i].id == s.id) {
    //         temp1 = true;
    //       }
    //     }
    //     if (temp2 && !temp1) {
    //       this.commissionsels.push(s);
    //     }
    //     else if (!temp2 && temp1) {
    //       if (this.authListSels) {
    //           this.authListSels.splice(this.authListSels.findIndex(item => item.productId == s.id), 1);
    //           this.reduceAuthList=true;
    //       }
    //       this.commissionsels.splice(this.commissionsels.findIndex(item => item.id == s.id), 1);
    //     }
    //   }
    //   else {
    //     this.commissionsels = sels;
    //   }

    //   if (sels.length <= 0) {
    //     this.commissionsels = [];
    //   }
    // },
    // commissionselsAll: function (sels) {
    //   if (this.commissionsels.length <= 0) {
    //     this.commissionsels = sels;
    //   }
    //   else {
    //     for (var i in sels) {
    //       if (this.commissionsels.find(d => d.id == sels[i].id))
    //         continue;
    //       else
    //         this.commissionsels.push(sels[i]);
    //     }
    //   }
    // },
    getAgreementNo: function (para) {
      findByAgreementNo(para).then((res) => {
        if (!commons.isEmpty(res.data.result.prpLmAgentList)) {
          this.customerTypeTemp = res.data.result.prpLmAgentList[0].alternate8;
          this.customerNameTemp = res.data.result.prpLmAgentList[0].alternate9;
          this.channelCodeTemp = res.data.result.prpLmAgentList[0].channel;
          this.channelNameTemp = res.data.result.prpLmAgentList[0].channelName;
          this.branchTemp = res.data.result.prpLmAgentList[0].branch;
          this.agentNameTemp = res.data.result.prpLmAgentList[0].agentName;
          this.orgCodeTemp = res.data.result.prpLmAgentList[0].alternate6;
          this.licenceNoTemp = res.data.result.prpLmAgentList[0].alternate7;
          console.log("this.agentNameTemp")
          console.log(this.agentNameTemp)
          if (res.data.result.selectSalePerson == true) {
            this.sellShow = true;
          } else {
            this.sellShow = false;
          }
        } else {
          this.$message({
            message: res.data.result,
            type: 'error'
          });
        }
      });
    },
    selectDataEdit() {
      this.restaurants=[];
      this.selectdatas = '';
      if (this.trenchForm.agrementNo) {
        let _this = this;
        let para = new FormData();
        para.append('agreementCode', _this.trenchForm.agrementNo);
        this.getAgreementNo(para);
        console.log(_this.trenchForm.agrementNo)
        this.getSale(para);
      }
    },

    // 点击树节点回调
    handleNodeClick: function (data, node, obj) {
      this.branchTitle = data.label;
      this.comCode = data.id;
      this.addNextForm.comCode = data.id;
      console.log(data.label.indexOf('-'));
      if (data.label.indexOf('-')!=-1) {
        this.addNextForm.upLevelName = data.label.substring(data.label.indexOf('-')+1,data.label.length);
      }else{
        this.addNextForm.upLevelName = data.label;
      }
      
      console.log(this.addNextForm.comCode);
       console.log(this.addNextForm.upLevelName);
      this.filters.branchNo = data.id;
      this.comLable = data.label;
      if (this.addNextChannel) {
        if (data.id == '0000') {
          this.addNextBtnVisible = false;
        } else {
          this.addNextBtnVisible = true;
        }
      }
      if (this.thisChannel) {
        if (data.id.substring(0, 2) == 'BS' || data.id.substring(0, 2) == 'WX') {
          this.serPresentVisible = true;
          // this.commissionPresentVisible = false;
        } else {
          // this.commissionPresentVisible = true;
          this.serPresentVisible = false;
        }
      }
      let para = new FormData();
      para.append('branchNo', data.id);
      para.append('type', 'order');
      treeNextChannelList(para).then((res) => {
        if (res.data.result && res.data.success == true) {
          for (let i in res.data.result) {
            let code = res.data.result[i].userCode;
            var newChild = {};
            if (code.substring(0, 2) == 'BS' || code.substring(0, 2) == 'WX') {
                newChild = { id: code, label: code+"-"+res.data.result[i].shopName, children: [] };
            }else{
                newChild = { id: code, label: res.data.result[i].shopName, children: [] };
            }
            if (!data.children) {
              this.$set(data, 'children', []);
            }
            if (typeof (commons.GetByID(this.data, code)) == 'undefined') {
              data.children.push(newChild);
            }
          }
        }
      });
      this.getLogs(true);
      //下级注册链接

      // let uuid = encode.hex_md5(this.filters.branchNo + ":1");
      // this.registerUrl = this.rootUrl + "?shareId=" + uuid;

      // let paraChannel = new FormData();
      // paraChannel.append('userCode', this.comCode);
      // thisChannel(paraChannel).then((channelRes) => {
      //   console.log(channelRes);
      //   let thisChannelResult = channelRes.data.result;
      //      if (thisChannelResult.canScore=="1") {
      //       this.canScoreDisable=true;
      //     }
      // });
    },
    //获取列表
    getLogs(bool) {
      let para = new FormData();
      para.append("pageSize", bool ? this.pageSize : this.total);
      para.append("pageNumber", bool ? this.page : 1);
      if (this.filters.channelId) {
        para.append("branchNo", this.filters.branchNo);
      }else{
        para.append("branchNo", commons.isEmpty(this.comCode)?"0000":this.comCode);
      }
      para.append("channelId", this.filters.channelId);
      para.append("istopUser", this.filters.istopUser);
      para.append("shopName", this.filters.shopName);
      para.append("mobile", this.filters.mobile);
      this.listLoading = bool;
      if (!bool) {
        this.loading = this.$loading({
          lock: true,
          text: '正在导出',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
      }
      nextChannelList(para).then((res) => {
        this.lists = res.data.result.list;
        this.total = res.data.result.totalElements;
        this.exportTotal = res.data.result.totalElements;
        this.listLoading = false;
        if (!bool) {
          this.loading.close();
          this.export2Excel();
        } else {
          this.branchs = res.data.result.list;
          this.total = res.data.result.total;
        }
      });
    },
    // 添加下级渠道提交
    addNextSubmit: function () {
      console.log('======================');
      this.addNextForm.comCode = this.comCode;
    
      // if (this.addNextForm.canScore == true) {
      //   this.addNextForm.canScore = '1';
      // } else {
      //   this.addNextForm.canScore = '0';
      // }
      // if (this.addNextForm.canModify == true) {
      //   this.addNextForm.canModify = '1';
      // } else {
      //   this.addNextForm.canModify = '0';
      // }
      this.saleNameTrench = this.addNextForm.saleName;
      // if ((this.comCode.substring(0, 2) != 'BS' || this.comCode.substring(0, 2) != 'WX'){

      // }
      this.selectData();
      setTimeout(() => {
        this.selectdatas = this.seltValue;
        console.log(this.selectdatas)
      }, 1500);
      this.addNextForm.channelCode = this.channelCodeTemp;
      this.addNextForm.channelName = this.channelNameTemp;
      this.addNextForm.customerType = this.customerTypeTemp;
      this.addNextForm.customerName = this.customerNameTemp;
      //branchCode 后台直接取到二级
      // this.addNextForm.branchCode = this.branchTemp;
      this.addNextForm.agrementName = this.agentNameTemp;
      this.addNextForm.orgCodeTemp = this.orgCodeTemp;
      this.addNextForm.licenceNo = this.licenceNoTemp;

      console.log(this.addNextForm)
      let para = this.addNextForm;
      this.idNumberVisible = false;
      this.$refs.addNextForm.validate((valid) => {
        if (valid) {
          this.$confirm('确认提交吗？', '提示', {}).then(() => {
            createChannelUser(para).then((res) => {
              this.editLoading = false;
              // if (res.data.state == 11) {
              //   this.oldPassVisible = true;
              //   this.$message({
              //     message: res.data.result,
              //     type: 'error'
              //   });
              // } else {
              if (res.data.success) {
                this.$message({
                  message: '提交成功',
                  type: 'success'
                });
                this.$refs['addNextForm'].resetFields();
                this.addNextVisible = false;
                this.getLogs(true);
              }
              else {
                this.$message({
                  message: res.data.result,
                  type: 'error'
                });
              }
              // }
            }).catch(() => {
            });
          });
        }
      });

    },
    userTypeChange: function (value) {
      if (value == 0) {
        this.userNameVisible = true;
        this.userRealNameVisible = false;
      } else {
        this.userNameVisible = false;
        this.userRealNameVisible = true;
      }
    },
    isTopChannel: function () {
      if (this.trenchForm.comCode) {
        let comcode = this.trenchForm.comCode.substring(0, 2);
        if (comcode == 'BS' || comcode == 'WX') {
          return true;
        } else {
          return false;
        }
      }
    },
    isTop: function () {
      if (this.addNextForm.comCode) {
        let comcode = this.addNextForm.comCode.substring(0, 2);
        if (comcode == 'BS' || comcode == 'WX') {
          return true;
        } else {
          return false;
        }
      }
    },
    // 添加下级渠道
    addNext: function () {
      this.customerNameTemp='';
      let paraChannel = new FormData();
      paraChannel.append('userCode', this.comCode);
      thisChannel(paraChannel).then((channelRes) => {
        console.log(channelRes);
        let thisChannelResult = channelRes.data.result;
        console.log(thisChannelResult);

        if (thisChannelResult.registerType == '1'||!commons.isEmpty(thisChannelResult.branchNo)) {

          this.addNextVisible = true;
          this.oldPassVisible = false;
          this.sellShow = false;
          this.editPassVisible = false;
          this.addNewPassVisible = false;
          this.editPassBtnVisible = false;
          this.validateMobile = false;

          this.addNextForm = {
            userName: '',// 姓名
            nickName: '',// 昵称
            idType: '',    //证件类型
            idNumber: '',// 证件号
            type: 1,//用户类型 0内部用户，1外部用户
            password: '',// 密码
            userRealName: '',
            imgCode: '', // 图形码
            mobileCode: '',// 手机验证码
            mobile: '',  // 手机号
            refereeId: '',// 分享ID
            refereePro: '',// 分享产品ID
            storeFlag: '',// 是否开店
            comCode: this.addNextForm.comCode,	 //所属部门--上级
            upLevelName:this.addNextForm.upLevelName,
            branchCode: '',// 机构编码
            agrementNo: '',// 业务关系代码
            agrementName: '',// 代理名称
            channelCode: '',// 渠道编码
            channelName: '',// 渠道名称
            saleCode: '',// 销售编码
            saleName: '',// 销售名称
            orgCode: '',// 组织机构代码
            licenceNo: '',// 营业执照号
            customerType: '',// 关系代码客户类型
            customerName: '',// 关系代码客户名称
            baseRate: '',
            canScore: true,
            canModify: '',
            defaultAuth: '',
            oldPassword: '',
            // isBackUser: '',
            // isMergeUser: 0,
            roleType: 1//角色 0是渠道经理  1渠道用户
          };
          this.editAddNextDisable = false;
          this.agrNoDisable = false;
          // if (thisChannelResult.canScore=="1") {
          //   this.canScoreDisable=true;
          // }
          this.ruleOfAddNext = true;

          let brNo = this.comCode.substring(0, 2);

          if (brNo == 'BS' || brNo == 'WX') {
            // let para = new FormData();
            // para.append("userCode", this.comCode);
            // topChannelUser(para).then((res) => {
            //   let data = res.data.result;
            this.agrNoDisable = true;
            this.addNextForm.agrementNo = thisChannelResult.agrementNo;
            this.saleNameTrench = thisChannelResult.saleName;
            if (thisChannelResult.agrementNo) {
              this.selectData();
              console.log(this.customerNameTemp);
              setTimeout(() => {
                this.addNextForm.customerName=this.customerNameTemp;
                console.log(this.customerNameTemp);
              }, 1500);
            }
            // });
          }
        } else {
          this.$message({
            message: '当前已是最后一级，不可再添加',
            type: 'error'
          });
        }
      });
    },

    // 查询当前渠道
    searchTrench: function () {
      this.searchTrenchVisible = true;
      this.registerUrlVisible = false;
      let para = new FormData();
      para.append('userCode', this.comCode);
      thisChannel(para).then((res) => {
        if (res.data.result.registerType==1) {
          this.registerUrlVisible = true;
          let uuid = encode.hex_md5(res.data.result.userCode + ":1");
          this.registerUrl = this.rootUrl + "?shareId=" + uuid;
        }
        this.searchTrenchForm = res.data.result;
        // this.searchTrenchForm.shopName = res.data.result.refereeUser.shopName;
        this.searchTrenchForm.comCode = res.data.result.refereeUser.userCode;
        this.searchTrenchForm.idType = this.searchTrenchForm.idType == 1 ? '身份证' : '统一社会信用代码';
        this.searchTrenchForm.branchCode = commons.Branchs(this.searchTrenchForm.branchCode);
        this.detailForm.shopName = this.searchTrenchForm.shopName;//二维码注册的渠道名称
        this.searchTrenchForm.storeFlag = this.searchTrenchForm.storeFlag == "1" ? "是" : "否";
        this.searchTrenchForm.userType = commons.customType(this.searchTrenchForm.userType);
        if (this.searchTrenchForm.canModify == '1') {
          this.searchTrenchForm.canModify = true;
        } else {
          this.searchTrenchForm.canModify = false;
        }
        if (this.searchTrenchForm.canScore == '1') {
          this.searchTrenchForm.canScore = true;
        } else {
          this.searchTrenchForm.canScore = false;
        }
      });
    },
    preview: function () {
      this.qrcodeVisible = true;
      $('#qrcode').html('');
      this.$nextTick(function () {
        var qrcode = new QRCode('qrcode', {
          width: 240,
          height: 240,
          colorDark: '#20a0ff',
          colorLight: '#ffffff',
          correctLevel: QRCode.CorrectLevel.H
        });
        qrcode.makeCode(this.registerUrl);
      });
    },

    //详情
    handleDetail: function (index, row) {
      this.detailForm = Object.assign({}, row);
      console.log(this.detailForm.upUserCode);
      this.registerUrlVisible = false;
      if (this.detailForm.registerType==1) {
        this.registerUrlVisible = true;
        let uuid = encode.hex_md5(this.detailForm.userCode + ":1");
        this.registerUrl = this.rootUrl + "?shareId=" + uuid;
      }
      this.detailForm.idType = this.detailForm.idType == 1 ? '身份证' : '统一社会信用代码';
      this.detailForm.storeFlag = this.detailForm.storeFlag == "1" ? "是" : "否";
      this.detailForm.roleType = parseInt(this.detailForm.sysUser.roleCode);
      this.detailForm.userType = commons.customType(this.detailForm.userType);
      this.detailForm.branchCode = commons.Branchs(this.detailForm.branchCode);
      this.detailForm.comCode = commons.hotArea(this.detailForm.comCode, this.hotArea);
      this.detailFormVisible = true;
      if (this.detailForm.canModify == '1') {
        this.detailForm.canModify = true;
      } else {
        this.detailForm.canModify = false;
      }
      if (this.detailForm.canScore == '1') {
        this.detailForm.canScore = true;
      } else {
        this.detailForm.canScore = false;
      }
    },
    cancel: function () {
      this.detailFormVisible = false;
      this.searchTrenchVisible= false;
    },
    //修改
    handleEdit: function (index, row) {
      console.log(row);
      this.trenchForm={};
      this.rankTypeChangeAble = false;
      this.editTrenchVisible = true;
      this.editPassBtnVisible = true;
      this.editPassVisible = false;
      this.addNewPassVisible = false;
      this.registerUrlVisible = false;
      this.saleNameTrench = '';
      if (row.registerType==1) {
        this.registerUrlVisible = true;
      }
      // this.selectdatas = '';
      this.trenchForm = Object.assign({}, row);
      console.log(this.trenchForm.upUserCode);
      if (row.refereeUser) {
        this.trenchForm.comCode = row.refereeUser.userCode;
        this.trenchForm.upLevelName = row.refereeUser.shopName;
      }
      this.trenchForm.userRealName = row.userName;
      if (row.sysUser) {
      //   this.trenchForm.userId = row.sysUser.userid;
        this.trenchForm.roleType = parseInt(this.trenchForm.sysUser.roleCode);
        this.roleCode = parseInt(this.trenchForm.sysUser.roleCode);
        this.trenchForm.sysBranchCode = this.trenchForm.sysUser.branchcode;
        this.trenchForm.branchName = this.trenchForm.sysUser.branchName;
      }
      if (this.trenchForm.canModify == '1') {
        this.trenchForm.canModify = true;
      } else {
        this.trenchForm.canModify = false;
      }
      if (this.trenchForm.canScore == '1') {
        this.trenchForm.canScore = true;
      } else {
        this.trenchForm.canScore = false;
      }
      
      // if (row.agrementNo) {
        this.trenchForm.agrementNo = row.agrementNo;
        this.saleNameTrench = row.saleName;
        this.selectDataEdit();
      // }else{
      //   let para = new FormData();
      //   para.append("userCode", this.trenchForm.userCode);
      //   topChannelUser(para).then((res) => {
      //     let data = res.data.result;
      //     this.trenchForm.agrementNo = data.agrementNo;
      //     this.saleNameTrench = data.saleName;
      //     this.selectDataEdit();
      //   });
      // }
      
      if (this.trenchForm.type == 0) {
        this.userNameVisible = true;
        this.userRealNameTrenVisible = false;
      } else {
        this.userNameVisible = false;
        this.userRealNameTrenVisible = true;
      }
    },
    //修改渠道提交
    editSubmit: function () {
       console.log(this.trenchForm);
      // this.branchs.splice(this.editindex, 1, this.editForm);
      if (this.sellShow) {
        if (!this.selectdatas) {
          this.$message({
              message: '请选择销售人员',
              type: 'error'
          });
        }else{
          this.editFormVisible = false;
          this.idNumberVisible = false;
          for (var i in this.restaurants) {
            if (this.restaurants[i].code == this.selectdatas && this.selectdatas != "") {
              this.trenchForm.saleName = this.restaurants[i].value.split('-')[0];
              this.trenchForm.saleCode = this.restaurants[i].code;
            }
          }
          console.log(this.customerNameTemp)
          this.trenchForm.channelCode = this.channelCodeTemp;// 渠道编码--
          this.trenchForm.channelName = this.channelNameTemp;
          this.trenchForm.customerType = this.customerTypeTemp;// 关系代码客户类型--
          this.trenchForm.customerName = this.customerNameTemp;
          this.trenchForm.branchCode = this.branchTemp;
          this.trenchForm.agrementName = this.agentNameTemp;
          this.trenchForm.orgCodeTemp = this.orgCodeTemp;
          this.trenchForm.licenceNo = this.licenceNoTemp;
          let para = this.trenchForm;
          this.$refs.trenchForm.validate((valid) => {
            console.log('11111111')
            if (valid) {
              console.log('12222222222222')
              updateChannelUser(para).then((res) => {
                console.log('123332222222')
                console.log(para)
                this.editLoading = false;
                if (res.data.success) {
                  this.$message({
                    message: '提交成功',
                    type: 'success'
                  });
                  this.editTrenchVisible = false;
                  this.rankTypeChangeAble = false;
                  this.trenchForm.roleType='';
                  this.getLogs(true);
                }
                else {
                  this.$message({
                    message: res.data.result,
                    type: 'error'
                  });
                }
              }).catch(() => {
              });
            }else{
              console.log("yanzbutongg")
            }
          });
        }
      }else{
          this.editFormVisible = false;
          this.idNumberVisible = false;
          console.log(this.trenchForm)
          if (this.trenchForm.canModify == true) {
            this.trenchForm.canModify = '1';
          } else {
            this.trenchForm.canModify = '0';
          }
          if (this.trenchForm.canScore == true) {
            this.trenchForm.canScore = '1';
          } else {
            this.trenchForm.canScore = '0';
          }
          for (var i in this.restaurants) {
            if (this.restaurants[i].code == this.selectdatas && this.selectdatas != "") {
              this.trenchForm.saleName = this.restaurants[i].value.split('-')[0];
              this.trenchForm.saleCode = this.restaurants[i].code;
            }
          }
          console.log(this.customerNameTemp)
          this.trenchForm.channelCode = this.channelCodeTemp;// 渠道编码--
          this.trenchForm.channelName = this.channelNameTemp;
          this.trenchForm.customerType = this.customerTypeTemp;// 关系代码客户类型--
          this.trenchForm.customerName = this.customerNameTemp;
          this.trenchForm.branchCode = this.branchTemp;
          this.trenchForm.agrementName = this.agentNameTemp;
          this.addNextForm.orgCodeTemp = this.orgCodeTemp;
          this.addNextForm.licenceNo = this.licenceNoTemp;
          let para = this.trenchForm;
          this.$refs.trenchForm.validate((valid) => {
            if (valid) {
              updateChannelUser(para).then((res) => {
                console.log(para)
                this.editLoading = false;
                if (res.data.success) {
                  this.$message({
                    message: '提交成功',
                    type: 'success'
                  });
                  this.editTrenchVisible = false;
                  this.getLogs(true);
                }
                else {
                  this.$message({
                    message: res.data.result,
                    type: 'error'
                  });
                }
              }).catch(() => {
              });
            }
          });
      }
      
    },
    IsExamines: function (index, row) {
      try {
        return row.IsExamines;
      }
      catch (err) {
        return false;
      }
    },
    handleExamine: function (index, row) {
      this.examineFormVisible = true;
      this.examineForm = row;
    },
    examineSubmit: function () {
      this.$confirm('确认通过吗？', '提示', {}).then(() => {
        this.branchs[index].IsExamines = false;
      });
    },
    //table导出excel
    exportExcels: function () {
      this.getLogs(false);
    },
    export2Excel: function () {
      require.ensure([], () => {
        const { export_json_to_excel } = require('../../vendor/Export2Excel');
        const tHeader = ['用户名', '用户类型', '是否店主', '用户编码','员工编码',  '手机号', '业务关系代码', '代理名称', '机构英文名', '机构', '渠道编码', '渠道名称', '上级', '关系代码客户类型', '关系代码客户名称', '邮箱', '证件类型', '证件号', '销售人名称', '销售人编码'];
        const filterVal = ['userName', 'userType', 'storeFlag', 'userCode','employeeCode','mobile', 'agrementNo', 'agrementName', 'ename', 'branchCode', 'channelCode', 'shopName',
          'comCode', 'channelType', 'customName', 'email', 'idType', 'idNumber', 'saleName', 'saleCode'];
        const list = this.lists;
        for (var i in list) {
          if (list[i].storeFlag) {
            list[i].storeFlag = list[i].storeFlag == '0' ? '否' : '是';
          }
          list[i].branchCode = commons.Branchs(list[i].branchCode);
          list[i].idType = list[i].idType == '1' ? '身份证' : '统一社会信用代码';
          list[i].userType = commons.customType(list[i].userType);
          list[i].comCode = commons.hotArea(list[i].comCode, this.hotArea);
        }
        const data = this.formatJson(filterVal, list);
        export_json_to_excel(tHeader, data, '渠道详情表');
      })
    },
    formatJson: function (filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    },
    getcustoms() {
      let _this = this;
      _this.data = [];
      _this.listLoading = true;
      levelList().then((res) => {
        var data = res.data.result;
        function gettree(arr, trees) {
          for (var i in arr) {
            let branchNo = arr[i].branchNo;
            if (branchNo.substring(0, 2) == 'BS' || branchNo.substring(0, 2) == 'WX') {
                trees.push({
                  id: branchNo,
                  label: branchNo+"-"+arr[i].branchCname,
                  children: []
                });
            }else{
                trees.push({
                  id: branchNo,
                  label: arr[i].branchCname,
                  children: []
                });
            }
            if (arr[i].nextBranch) {

              gettree(arr[i].nextBranch, commons.GetByID(trees, branchNo).children);
            }
          }
        }
        gettree(data, _this.data);
      });
    },
    getSelectPerTree: function () {
      let para = new FormData();
      var userinfo = sessionStorage.getItem('user');
      if (userinfo) {
        var user = JSON.parse(userinfo);
      }
      var userid = user.userId;
      para.append('userId', userid);
      para.append('type', 'order');
      let modelTree = this.data;
      let leafTree = [];
      orderAuth(para).then((res) => {
        var data = res.data.result;
        if (data) {
          this.comCode=data[0].branchNo;
        }
        gettree(data, this.data);
        console.log(this.data)
      });
      function gettree(arr, trees) {
        for (var i in arr) {
          if (typeof (commons.GetByID(trees, arr[i].branchNo)) == 'undefined') {
            let branchNo = arr[i].branchNo;
            if (branchNo.substring(0, 2) == 'BS' || branchNo.substring(0, 2) == 'WX') {
                trees.push({
                  id: branchNo,
                  label: branchNo+"-"+arr[i].branchCname,
                  children: []
                });
            }else{
                trees.push({
                  id: branchNo,
                  label: arr[i].branchCname,
                  children: []
                });
            }
          }
          if (arr[i].nextBranch) {
            let childTree = commons.GetByID(trees, arr[i].branchNo);
            gettree(arr[i].nextBranch, childTree.children);
          }
        }
      }
       // setTimeout(() => {
        this.getLogs(true);
      // }, 100);
    },
    roleList:function(){
      let role = new FormData();
      role.append("pageSize", 100);
      role.append("pageNumber", this.page);
      role.append('type','');
      roleList(role).then((res) => {
        var data = res.data.result.content;
        if (this.roles == "") {
          for (var i in data) {
            this.roles.push({
              id: data[i].roleid,
              label: data[i].rolename
            });
          }
        }
      });
    },
    btnShow: function () {
      let thisData = JSON.parse(sessionStorage.getItem('181'));
      let _this = this;
      $.each(thisData, function (i, j) {
        if (thisData[i] == "addNextChannel") {
          _this.addNextChannel = true;
        }
        if (thisData[i] == "agentBranchExport") {
          _this.agentBranchExport = true;
        }
        if (thisData[i] == "agentBranchQuery") {
          _this.agentBranchQuery = true;
        }
        if (thisData[i] == "channelUpdate") {
          _this.channelUpdate = true;
        }
        if (thisData[i] == "thisChannel") {
          _this.thisChannel = true;
        }
        if (thisData[i] == "channelDetail") {
          _this.chanelDetail = true;
        }
      });
    },
  },
  mounted() {
    this.btnShow();
    $('#branch_left').css('height', this.winHeight - 70 + 'px');
    $('#branch_right').css('height', this.winHeight - 70 + 'px');
    this.roleList();
    this.getSelectPerTree();
    // this.findHotAreaList();

  }
}

</script>

<style scoped>
.el-tree {
  border: 0;
}
.toolbar {
  margin: 0;
}
.detailLabel {
  /*float:left;*/
  display: inline-block;
  text-align: right;
  width: 120px;
  color: #0b80da;
  font-weight: bold;
}
.qrcodeLabel {
  float:left;
  /*display: inline-block;*/
  /*text-align: right;*/
  /*width: 100%;*/
  color: #0b80da;
  font-weight: bold;
  margin-bottom: 10px;
}
.detaillabel {
  margin-bottom: 10px;
}
.help-block {
  color: #ff4949;
  font-size: 12px;
  display: block;
}
</style>